<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../../../css/app.css">
    <link rel="stylesheet" type="text/css" href="../comm/swiper.min.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/tabBar.css">
    <link rel="stylesheet" type="text/css" href="../comm/shop_comm.css" />
    <link rel="stylesheet" type="text/css" href="./css/shop_index_fram.css">
    <title>推荐</title>
    <style media="screen">
        #app {
            display: block
        }
    </style>
</head>

<body>
    <div id="app">
        <div class="header">
            <div class="header_left" @click="api.closeWin()">
                <img src="../../../image/backtrack.png" alt="">
            </div>
            <div class="header_center">
                消息
            </div>
            <div class="header_right"></div>
        </div>
        <div class="con_" v-cloak>
            <div class="message_box">
                <div class="message_list" v-for="(item,index) in MessageList">
                    <div class="message_list_head">
                        <span v-text="item.date">03月25日</span>
                    </div>
                    <div class="message_list_title">
                        <span class="text1" v-text="item.title"></span>
                    </div>
                    <div class="message_list_message">
                        <!-- <span class="red"></span> -->
                        <span class="msg" v-text="item.msg"></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../../sea.js" data-main="../../main"></script>
<script type="text/javascript" src="../../vue.js"></script>
<script type="text/javascript">
    apiready = function() {
        seajs.use(["../../api", "../../jquery", "../../app", "../../service"], function($api, $, app, service) {
            var vm = {
                el: "#app",
                data: {
                    code: '',
                    offon: true,
                    page: 1,
                    MessageList: []
                },
                mounted: function() {
                    this.getMessageList()
                },
                methods: {
                  // 触底
                  scrolltobottom:function(){
                      if(this.offon){
                        this.offon = false
                        this.page+=1
                        this.getMessageList()
                      }
                  },
                    // 获取消息列表
                    getMessageList: function(cb) {
                        var that = this
                        app.ajax(
                            service['getMessageList'], {
                                data: {
                                    values: {
                                        page: this.page
                                    }
                                }
                            },
                            function(res) {
                                if (res.code == 0) {
                                    if (that.page == 1) {
                                        that.MessageList = res.data
                                    } else {
                                        if (res.data.length == 0) {
                                            api.toast({
                                                msg: '没有更多数据',
                                                duration: 2000,
                                                location: 'bottom'
                                            });
                                        } else {
                                            that.MessageList = that.MessageList.concat(res.data)
                                            that.offon = true
                                        }
                                    }
                                }
                            })
                    }
                }
            }
            var even = function() {
                api.addEventListener({
                    name: 'scrolltobottom',
                    extra: {
                        threshold: 0 //设置距离底部多少距离时触发，默认值为0，数字类型
                    }
                }, function(ret, err) {
                    newVue.scrolltobottom()
                });
            }
            var newVue = new Vue(vm);
            even();
        })
    }
</script>

</html>
